<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>俗谣雅玖-个人中心</title>
		<link href="/images/logo.ico" rel="icon" type="image/x-ico">

		<!-- Mobile Specific Metas
        ================================================== -->
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

		<meta name="viewport" content="width=device-width, initial-scale=1">
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<meta name="keywords" content="">
		<script type="application/x-javascript"> addEventListener("load", function() { setTimeout(hideURLbar, 0); }, false);
		function hideURLbar(){ window.scrollTo(0,1); } </script>
		<!-- //for-mobile-apps -->
		<!-- js -->
		<script src="/js/jquery-1.11.1.min1.js"></script>
		<!-- //js -->
		<link href="/css/style2.css" rel="stylesheet" type="text/css" media="all">
		<!-- CSS
        ================================================== -->
		<link rel="stylesheet" href="/css1/zerogrid.css">
		<link rel="stylesheet" href="/css1/style.css">
		<link rel="stylesheet" href="/css1/lightbox.css">

		<!-- Custom Fonts -->
		<link href="/css1/font-awesome.min.css" rel="stylesheet" type="text/css">

		<link rel="stylesheet" href="/css1/menu.css">
		<script src="/js1/jquery1111.min.js" type="text/javascript"></script>
		<script src="/js1/script.js"></script>

		<!-- Owl Carousel Assets -->
		<link href="owl-carousel/owl.carousel.css" rel="stylesheet">
		<!-- <link href="owl-carousel/owl.theme.css" rel="stylesheet"> -->

		<!--[if lt IE 8]>
		<div style=' clear: both; text-align:center; position: relative;'>
			<a href="http://windows.microsoft.com/en-US/internet-explorer/Items/ie/home?ocid=ie6_countdown_bannercode">
				<img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today." />
			</a>
		</div>
		<![endif]-->
		<!--[if lt IE 9]>
		<script src="/js/html5.js"></script>
		<script src="/js/css3-mediaqueries.js"></script>
		<![endif]-->

	</head>

	<body>
	<div class="wrap-body">
		<div class="header">
			<div id='cssmenu' class="align-right">
				<ul>
					<li class="active">
						<a href='beckoning.jsp'><span>心动</span></a>
					</li>
					<li class=' has-sub'>
						<a href='record.jsp'><span>记录</span></a>
						<ul>
							<li class='has-sub'>
								<a><span>触动</span></a>
								<ul>
									<li>
										<a href='/suyaoyajiu/collection.jsp'><span>收藏</span></a>
									</li>
									<li class='last'>
										<a href='/suyaoyajiu/mail.jsp'><span>留言</span></a>
									</li>
								</ul>
							</li>
						</ul>
					</li>
					<li>
						<a href='/suyaoyajiu/personalcenter.jsp'><span>个人中心</span></a>
					</li>
					<li class='last'>
						<a href="http://wpa.qq.com/msgrd?v=3&uin=1013042589&site=qq&menu=yes"><span>联系</span></a>
					</li>
				</ul>
			</div>
		</div>
		</div>
	<div class="main">
		<div class="w3l_main_grid">
			<div class="w3l_main_grid1">
				<div class="w3l_main_grid1_left">
					<img src="/images/edit.png" style="width: 20px; height: 20px;"
					 class="img-responsive" onclick="window.location.href='/suyaoyajiu/edit.jsp'">
				</div>
				<div class="w3l_main_grid1_right">
					<div class="menu">


						<!-- script-for-menu -->
						<script>
							$( "span.menu-icon" ).click(function() {
								$( "ul.nav1" ).slideToggle( 300, function() {
									// Animation complete.
								});
							});
						</script>
						<!-- /script-for-menu -->
					</div>
				</div>
				<div class="clear"> </div>
				<div class="w3l_main_grid1_sub">
					<h2>${user.username}</h2>
				</div>
			</div>
			<div class="w3l_main_grid2">
				<div class="sap_tabs">

					<div id="horizontalTab" style="display: block; width: 100%; margin: 0px;">
						<div class="resp-tabs-container">

							<h2 class="resp-accordion" role="tab" aria-controls="tab_item-0"><span class="resp-arrow"></span> </h2><div class="tab-1 resp-tab-content" aria-labelledby="tab_item-0">

						</div>
							<h2 class="resp-accordion" role="tab" aria-controls="tab_item-1"><span class="resp-arrow"></span> </h2>
							<h2 class="resp-accordion" role="tab" aria-controls="tab_item-2"><span class="resp-arrow"></span> </h2>
							<h2 class="resp-accordion resp-tab-active" role="tab" aria-controls="tab_item-3"><span class="resp-arrow"></span> </h2><div class="tab-3 resp-tab-content resp-tab-content-active" aria-labelledby="tab_item-3" style="display:block">
						</div>
							<h2 class="resp-accordion" role="tab" aria-controls="tab_item-4"><span class="resp-arrow"></span></h2><div class="tab-4 resp-tab-content" aria-labelledby="tab_item-4">
							<div class="wthree_tab_grid">
								<h4>Contact Me</h4>
								<ul class="wthree_tab_grid_list">
									<li><img src="/images/call.png" alt=" " class="img-responsive"></li>
									<li>Mobile<span>+123 234 4342</span></li>
								</ul>
								<ul class="wthree_tab_grid_list">
									<li><img src="/images/mail.png" alt=" " class="img-responsive"></li>
									<li>Mail Me<span><a href="#">info@example.com</a></span></li>
								</ul>
							</div>
						</div>
						</div>

						<ul class="resp-tabs-list">
							<li class="resp-tab-item" aria-controls="tab_item-0" role="tab"><h2><span class="w3ls_figure"> </span></h2></li>
							<li class="resp-tab-item" aria-controls="tab_item-1" role="tab"><span class="w3ls_figure1"> </span></li>
							<li class="resp-tab-item" aria-controls="tab_item-2" role="tab"><span class="w3ls_figure2"> </span></li>
							<li class="resp-tab-item resp-tab-active" aria-controls="tab_item-3" role="tab"><span class="w3ls_figure3"> </span></li>
							<div class="clear"> </div>
						</ul>
					</div>
				</div>
				<script src="/js/easyResponsiveTabs.js" type="text/javascript"></script>
				<script type="text/javascript">
					$(document).ready(function () {
						$('#horizontalTab').easyResponsiveTabs({
							type: 'default', //Types: default, vertical, accordion
							width: 'auto', //auto or any width like 600px
							fit: true   // 100% fit in a container
						});
					});
				</script>
			</div>
		</div>
		<div class="wthree_footer_copy">

		</div>
	</div>
	</body>

</html>